// src/store/index.js
import Vue from 'vue';
import Vuex from 'vuex';

Vue.use(Vuex);

export default new Vuex.Store({
  state: {
    phoneQuantity: 0,
    computerQuantity: 0,
    keyboardQuantity: 0,
    totalPrice: 0,
    phonePrice: 1000,
    computerPrice: 2000,
    keyboardPrice: 500,
  },
  mutations: {
    setPhoneQuantity(state, quantity) {
      state.phoneQuantity = quantity;
    },
    setComputerQuantity(state, quantity) {
      state.computerQuantity = quantity;
    },
    setKeyboardQuantity(state, quantity) {
      state.keyboardQuantity = quantity;
    },
    setTotalPrice(state, price) {
      state.totalPrice = price;
    },
  },
  actions: {
    increasePhoneQuantity({ commit }) {
      commit('setPhoneQuantity', this.state.phoneQuantity + 1);
      commit('setTotalPrice', this.state.totalPrice + this.state.phonePrice);
    },
    decreasePhoneQuantity({ commit }) {
      if (this.state.phoneQuantity > 0) {
        commit('setPhoneQuantity', this.state.phoneQuantity - 1);
        commit('setTotalPrice', this.state.totalPrice - this.state.phonePrice);
      }
    },
    increaseComputerQuantity({ commit }) {
      commit('setComputerQuantity', this.state.computerQuantity + 1);
      commit('setTotalPrice', this.state.totalPrice + this.state.computerPrice);
    },
    decreaseComputerQuantity({ commit }) {
      if (this.state.computerQuantity > 0) {
        commit('setComputerQuantity', this.state.computerQuantity - 1);
        commit('setTotalPrice', this.state.totalPrice - this.state.computerPrice);
      }
    },
    increaseKeyboardQuantity({ commit }) {
      commit('setKeyboardQuantity', this.state.keyboardQuantity + 1);
      commit('setTotalPrice', this.state.totalPrice + this.state.keyboardPrice);
    },
    decreaseKeyboardQuantity({ commit }) {
      if (this.state.keyboardQuantity > 0) {
        commit('setKeyboardQuantity', this.state.keyboardQuantity - 1);
        commit('setTotalPrice', this.state.totalPrice - this.state.keyboardPrice);
      }
    },
  },
});